﻿@model IEnumerable<CallCenter.Data.Models.MenuVM>

@{
    ViewBag.Title = "Menu Access";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<style>
    .table-fill {
        background: white;
        border-radius: 3px;
        border-collapse: collapse;
        height: 320px;
        margin: auto;
        max-width: 600px;
        padding: 5px;
        width: 100%;
        box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
        animation: float 5s infinite;
    }

    td {
        background: #FFFFFF;
        padding: 10px;
        text-align: left;
        vertical-align: middle;
        font-weight: 100;
        font-size: 18px;
        text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.1);
        border: 1px solid #C1C3D1;
    }

    th {
        font-weight: bolder;
        background: #FFFFFF;
        padding: 10px;
        text-align: left;
        vertical-align: middle;
        font-size: 18px;
        text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.1);
        border: 1px solid #C1C3D1;
    }
    .Empty {
        height:20px;
    }
</style>
<div class="Empty"></div>
<div class="form-group">
    <div class="col-md-3">
    </div>
    <div class="col-md-4">
        @Html.DropDownList("RoleId", (IEnumerable<SelectListItem>)ViewBag.RoleId, new { @class = "form-control" })
    </div>
    <div class="col-md-3">
    </div>
</div>
<div class="Empty"></div>
<div class="form-group">
    <div class="col-md-10 MenuContent">
        @Html.Partial("~/Views/MenuAccess/_ParentMenu.cshtml", Model)
    </div>
</div>
<div class="Empty"></div>

<script>

    $(document).ready(function () {
        $("#RoleId").change(function () {
            GetMenuContent();
        });
    });
    function ChangeStatus(RoleID, MenuID, Status) {
        $.post("/MenuAccess/ChangeStatus",
       {
           RoleID: RoleID,
           MenuID: MenuID,
           Status: Status
       },
       function (data) {
           var src = "";
           var id = "#" + MenuID;
           src = "/Content/" + data + ".png";
           $(id).attr('src', src);
       });
    }

    function GetMenuContent() {
        $.post("/MenuAccess/GetMenuContentByRole",
            {
                RoleId: $("#RoleId").val()
            },
            function (data) {
                $(".MenuContent").html(data)
            });
    }
</script>



